<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="zh">
<head>
    <title>系统配置文件</title>
    <jsp:include page="/WEB-INF/view/commons/css.jsp" />
</head>
<body >
<div id="main-container" class="container-fluid">
    <div class="row">
        <div class="col-md-4">
            <button id="saveBtn" type="button" class="btn btn-sm btn-primary"><i class="fa fa-floppy-o"></i> 提交</button>
            <button type="button" class="btn btn-sm link_close"><i class="fa fa-close"></i> 关闭</button>
        </div>
    </div>
    <div class="row">
        <ul id="treeDemo" class="ztree" style="overflow: auto;width: 95%"></ul>
    </div>

</div><!--/#main-container-->
<div id="operate" class="hide">
    <small class="operates ">
    <c:forEach items="${operateList }" var="each">
        <label><input type="checkbox" value="${each.value }" class="ace ${each.value }"><span class="lbl"></span> ${each.label }</label>
    </c:forEach>
    </small>
</div>
<!-- script start -->
<jsp:include page="/WEB-INF/view/commons/js.jsp" />
<link rel="stylesheet" href="static/plugin/ztree-3.5/css/zTreeStyle/zTreeStyle.css" />
<script type="text/javascript" src="static/plugin/ztree-3.5/js/jquery.ztree.all-3.5.min.js"></script>
<script type="text/javascript">
    function zTreeOnCheck(event, treeId, node) {
        $('#opitem'+node.id).find(':checkbox').attr("checked",node.checked);
        if(node.children){
            $.each(node.children,function(i,n){
                $('#opitem'+n.id).find(':checkbox').attr("checked",node.checked);
            });
        }
    }
    var tree_setting = {
        check : {
            enable : true,
            chkStyle:'checkbox',
            chkboxType:{"Y" : "ps","N" : "ps"}
        },
        view: {
            nameIsHTML: true,
            showTitle:false
        },
        data : {
            simpleData : {
                enable : true,
                idKey : "id",
                pIdKey : "parentId",
                rootPId : 0
            }
        },
        callback: {
            onCheck: zTreeOnCheck
        }
    };

    var zNodes = [];

    var code;
    var zTree;
    $(document).ready(function() {
        $.ajax({url : 'sysrole/queryRoleMenuTree?roleId=${roleId}',
            type : "get",
            dataType : "json",
            cache: false,
            success : function(res) {
//            console.log(res);
                if(res.success) {
                    var map = res.data;
                    var entity = map.entity;
                    var index = parent.layer.getFrameIndex(window.name);
                    parent.layer.title('分配权限【'+entity.name + '】', index);
                    zNodes = map.permissions;
                    var roleMenus = map.roleMenus;
                    var op = $('#operate');
                    $.each(zNodes, function (i, n) {
                        n.name = n.permissionName;
                        if(roleMenus && roleMenus.length > 0){
                            $.each(roleMenus, function(i, roleMenu){
                                if(n.id == roleMenu.menuId){
                                    n.checked=true;
                                    n.rights = roleMenu.rights;
                                    return false;
                                }
                            });
                        }
                        if (n.permissionCode) {
                            var _op = op.clone();
                            _op.find('.operates').attr('id', 'opitem' + n.id);
                            if (n.checked) {
                                if (n.rights && n.rights != '*') {
                                    var _arr = n.rights.split(',');
                                    $.each(_arr, function (i1, n1) {
                                        _op.find(':checkbox[value=' + n1 + ']').attr("checked", true);
                                    });
                                } else {
                                    _op.find(':checkbox').attr("checked", true);
                                }
                            }
                            n.name = n.name + _op.html();
                        }
                    });
//                    console.log('zNodes',zNodes);
                    zTree = $.fn.zTree.init($("#treeDemo"), tree_setting, zNodes);
                    zTree.expandAll(true);
                }
            }
        });

        $('#saveBtn').click(function(){
            var nodes = zTree.getCheckedNodes(true);
            if (nodes.length < 1) {
                layer.alert('请先选择权限');
                return false;
            }

            //选中的菜单
            var menuArr = [];
            var opsArr = [];
            $.each(nodes,function(i,n) {
                var ops = '';
                $('#opitem'+n.id).find('input:checked').each(function(){
                    ops += ',' + this.value;
                });
                if(!ops){
                    ops = ",*";
                }
                menuArr.push(n.id);
                opsArr.push(ops.substr(1));
            });

            $.ajax({
                url : 'sysrole/saveRoleMenu',
                data : {
                    roleId : '${roleId}',
                    menuIds : menuArr.join(','),
                    rightsIds : opsArr.join(';')
                },
                type : "post",
                dataType : "json",
                success : function(data) {
                    if(data.msg){
                        layer.alert(data.msg,function(index){
                            layer.close(index);
                            closeIframe();
                        });
                    }

                }
            });
        });

    });
</script>
<!-- script end -->
</body>
</html>